<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>在线购买 - {siteseo name='title'}</title>
		<meta name="author" content="MuYuCMS leK" />
		<meta name="viewport"
			content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link href="__HOMEST__static/layui/css/layui.css" rel="stylesheet" type="text/css" />
		<link href="__HOMEST__static/css/muyu_pay_style.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<div class="loging">
			<div class="loging-fom">
				<div class="layui-form">
					<div class="layui-form-item" style="color: #4E5465;">
						<h2>收银台</h2>
					</div>
					<hr style="background: #06a3e2a1;">
					<input type="hidden" name="payst" id="pay" value="" />
					<input type="hidden" name="matid" value="{$pay.id}" />
					<!--这里放需要传递到支付页面的值-->
					<!--<input type="hidden" name="" id="" value="" />-->
					<!---->
					<fieldset class="layui-elem-field">
						<legend>产品介绍</legend>
						<div class="layui-field-box">

							<div class="layui-form-item">
								<label class="layui-form-label">产品：</label>
						        <h4 style="padding: 9px 0px;">{$pay.title}</h4>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">作者：</label>
								<p style="padding: 9px 0px;">{$pay.author}</p>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">说明：</label>
								<p style="padding: 9px 0px;">产品购买后不支持退款，请熟知！</p>
							</div>
						</div>

					</fieldset>
					<fieldset class="layui-elem-field">
						<legend>支付明细</legend>
						<div class="layui-field-box">

							<div class="layui-form-item">
								<label class="layui-form-label">应付总额：</label>
								<label class="layui-form-label" style="color:#1E9FFF">￥{$pay.moneys}元</label>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">优惠金额：</label>
								<label class="layui-form-label">￥0.00元</label>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">钱包余额：</label>
								<label class="layui-form-label" style="color:#5FB878">￥{$member.money}元</label>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">还需支付：</label>
								<label class="layui-form-label" style="color:#FF5722;">￥{$pay.need}元</label>
							</div>
						</div>

					</fieldset>
					<fieldset class="layui-elem-field">
						<legend>支付方式</legend>
						<div class="layui-field-box">

							<div class="layui-form-item">
								<a href="##wxpay" onclick='activeImg(this)' data-palytype="wxpay" class="zfxz"
									style="float: left;margin-left: 15px;text-align: center;">
									<img src="__HOMEST__static/icon/wx.svg" alt="" width="50px">
									<br>
									<span>微信支付</span>
								</a>
								<a href="##qqpay" onclick='activeImg(this)' data-palytype="qqpay" class="zfxz"
									style="float: left;margin-left: 15px;text-align: center;">
									<img src="__HOMEST__static/icon/qq.svg" alt="" width="50px">
									<br>
									<span>QQ支付</span>
								</a>
								<a href="##alipay" onclick='activeImg(this)' data-palytype="alipay" class="zfxz"
									style="float: left;margin-left: 15px;text-align: center;">
									<img src="__HOMEST__static/icon/zfb.svg" alt="" width="50px" height="50px">
									<br>
									<span>支付宝支付</span>
								</a>
								<a href="##moneypay" onclick='activeImg(this)' data-palytype="moneypay" class="zfxz"
									style="float: left;margin-left: 15px;text-align: center;">
									<img src="__HOMEST__static/icon/ye.svg" alt="" width="50px">
									<br>
									<span>余额支付</span>
								</a>

							</div>
						</div>
					</fieldset>

					<div style="text-align: center;">
						<button class="layui-btn layui-btn-radius layui-btn-normal" lay-submit lay-filter="paly">>>前往支付</button>
					</div>
				</div>
			</div>
		</div>
		<div
			style="height: 46px;line-height: 46px;text-align: center;color: #000;font-size: 12px;margin-top:20px;">
			Copyright &copy;2020-<?php echo date('Y');?> {siteseo name='title'} All Rights Reserved.</p>
		</div>
		<script type="text/javascript" src="__HOMEST__static/layui/layui.js"></script>
		<script src="//s3.pstatp.com/cdn/expire-1-w/jquery/3.4.0/jquery.min.js"></script>
		<style>
			.active {
				border: 3px solid #a6d9ee !important;
				opacity: 1 !important;
				padding: 10px;
			}
		</style>
		<script>
			layui.use('form', function() {
				var $ = layui.$,
					form = layui.form,
					layer = layui.layer;


				form.on('submit(paly)', function(data) {
					var Data = data.field;
					var matid = "{$pay.id}";
					if (!Data["payst"]) {
						layer.msg("请选择支付方式!", {
							time: 2000
						});
						return false;
					}
					
					if(Data["payst"]=="alipay"){
                        window.open("/palymat/topaly?payst=alipay&matid=" + matid);
                    }else{
                        if(Data["payst"]=="wxpay"){
                            window.open("/palymat/topaly?payst=wxpay&matid="+ matid);
                        }else{
                            if(Data["payst"]=="qqpay"){
                            window.open("/palymat/topaly?payst=qqpay&matid="+ matid);
                            }else{
                                if(Data["payst"]=="moneypay"){
                                    window.open("/palymat/topaly?payst=moneypay&matid="+ matid);
                                }
                            }
                        }
                    }
				});
			});

			function activeImg(obj) {
				$(".zfxz").removeClass("active");
				$(obj).addClass('active');
				$("#pay").val($(obj).data("palytype"));
			}
		</script>
	</body>
</html>
